{% extends "base.html" %}
{% block title %}Ingresos{% endblock %}
{% block head %}
    {{ super() }}

	<script type="text/javascript" src="/assets/js/jquery.js"></script>
  	<script type="text/javascript" src="/assets/js/jquery.validate.js"></script>

 	<script>
		$(document).ready(function() {   
			$(".table-grid tr:even").addClass("alt");
		}); 
  </script>
    
{% endblock %}
{% block content %}
	<h1>Ingresos mensuales</h1>
	<br>
	<table id="table-grid" class ="table-grid">
    	<tr>
            <th width="170px">Nombre</th>
            <th width="100px">Ingresos</th>
            <th width="100px">Ingresos Extra</th>
		</tr>
		{% for m in months %}
        <tr id="row{{ loop.index }}">
            <td >
            	<div ><a href="/month/edit?id_month={{ m.key().id() }}">{{ m.name|escape }}</a></div>
            </td>
            <td >
            	{{"${:,.0f}".format(m.income)}}
            </td>
            <td >
            	{{"${:,.0f}".format(m.extra_income)}}
            </td>
		</tr>
        {% endfor %}
	</table>
{% endblock %}
